﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>style the table</title>
    <link rel="stylesheet" type="text/css" href="common1.css" />
    <style type="text/css">
        table
        {
            border-collapse: collapse;
            width: 50%;
        }
        th
        {
            background-color: green;
            color: white;
        }
        th, td
        {
            height: 50px;
        }
        td
        {
            text-align: right;
            vertical-align: bottom;
            padding: 15px;
        }
        table, td, th
        {
            border: 2px solid green;
        }
    </style>
</head>
<body>
    <table>
        <tr>
            <th>
                Firstname
            </th>
            <th>
                Lastname
            </th>
        </tr>
        <tr>
            <td>
                Peter
            </td>
            <td>
                Griffin
            </td>
        </tr>
        <tr>
            <td>
                Lois
            </td>
            <td>
                Griffin
            </td>
        </tr>
    </table>
    <hr />
    <div class="note">
        <p>
            Notes:</p>
        <ul>
            <li>the "padding" property controls the space between the border and content in a table
            </li>
        </ul>
    </div>
</body>
</html>
